<template>
	<view class="u-wrap">
		<scroll-view >
		<view class="content">
			<u-toast ref="uToast" />
			<!-- 个人资料 -->
			<u-button size="mini" style="visibility:hidden"></u-button>
			<view>
				<view class="_img">
					<u-image width="160" height="160rpx" :src='user.avatar' shape='circle'></u-image>
					<u-icon name="camera-fill" size="40" class="u-icon"></u-icon>

				</view>
				<view class="_data">
					<view style="margin-bottom: 9rpx; font-size: 42rpx;">{{user.realName}}
						<u-icon name="woman" style="margin-left: 20rpx;" v-if="user.sex=='1'"></u-icon>
						<u-icon name="man" style="margin-left: 20rpx;" v-if="user.sex=='0'"></u-icon>
					</view>
					<view style="margin-bottom: 9rpx;font-size: 37rpx;">{{user.birthTime|formatDateTime}}</view>
					<view style=" font-size: 37rpx">{{user.area}}</view>
				</view>
				<view class="autograph">
					个性签名:{{user.signature}}
				</view>
				<view class="QR-code">
					<u-upload ref="uUpload" :action="action" :auto-upload="true" max-count="1" v-if="show"></u-upload>

					<image :src="user.qrCode" mode="" style="width: 100%;height: 100%;" v-if="img"></image>
				</view>

				<u-button size="medium" @click="Savepicture()" :custom-style="erweimabtn">保存抖音码</u-button>
			</view>
		</view>
		<view class="advertisement">
			<ad unit-id="70b5n6l4fh73e998m8"  ad-intervals=40 @binderror='error'></ad>
		</view>
		</scroll-view >
	</view>
</template>

<script>
	import { formatDate } from "../../common/utils/Date.js";
	export default {
		data() {
			return {
				erweimabtn: {
					'position': 'relative',
					'top': '400rpx',
					'width': ' 230rpx',
					'background-color': '#98C1FF',
					'left': '240rpx',
				},
				mdp: {
					'position': 'relative',
					'left': '70%',
					'background-color': '#98C1FF',
					'top': '20rpx',
					'right': '80rpx'
				},
				lists: '',
				img: true,
				show: false,
				user: {
					qrCode: '../../static/code.png',
					avatar: '',
					realName: '',
					birthTime: '',
					area: '',
					avatarUrl: '',
				},
			}
		},
			created(){
				this.user=uni.getStorageSync('data');
			},
			  filters: {
			    formatDateTime(time) {
			      if (time == null || time === "") {
			        return "N/A";
			      }
			      let date = new Date(time);
			      return formatDate(date, "yyyy-MM-dd ");
			    },
			  },
			  onShareAppMessage (option) {
			    return {
			      title: '快来康康同样的TA',
			      desc: '这是默认的转发文案，用户可以直接发送，也可以在发布器内修改',
			      path: '/page/OthersCenter/OthersCenter', // ?后面的参数会在转发页面打开时传入onLoad方法
			    
			      templateId: 'xmqi3vul2929i5gn3b',
			      success () {
			        console.log('转发发布器已调起，并不意味着用户转发成功，微头条不提供这个时机的回调');
			      },
			      fail () {
			        console.log('转发发布器调起失败');
			      }
			    }
			  },
		methods: {
		error(e){
			console.log(e,'错误')
			},
			//点击保存二维码
			Savepicture() {
				uni.showActionSheet({
					itemList: ["保存到相册"],
					success: res => {
						if (res.tapIndex == 0) {
							uni.showLoading({
								title: "保存中..."
							})
							setTimeout(function() {
								uni.hideLoading()
							}, 6000);
							uni.downloadFile({
								url: this.user.qrCode, //网络路径，下载下来  
								success: (res) => {
									if (res.statusCode === 200) {
										uni.saveImageToPhotosAlbum({
											filePath: res.tempFilePath, //下载后的临时路径  
											success: res => { //下载完成后在相册里压根找不到  
												uni.hideLoading()
												uni.showToast({
													title: "保存成功！"
												})
											}
										})
									}
								}
							});
						}
					}
				})
			},


			// 跳转修改个人信息页面
			handmodify() {
				this.$u.route('pages/modification/index')

			},
		},
	}
</script>

<style lang="scss" scoped>
	.u-wrap {
		padding: 5rpx 5rpx 0 5rpx;
	}

	.advertisement {
		margin-top: 4%;
		font-family: PingFang SC;
		width: 100%;
		position: relative;
		bottom: -100rpx;
		box-shadow: 0px 2px 5px #888888;
		border: 2px darkslategray;
	}

	.content {

		font-family: PingFang SC;

		font-weight: 400;

		width: 100%;
		height: 954rpx;
		background: #FFFFFF;
		box-shadow: 0px 3px 6px rgba(78, 78, 78, 0.12);
		opacity: 1;
		border-radius: 20px;

		.autograph {
			font-size: 35rpx;
			font-weight: 400;
			color: #707070;
			-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
			text-stroke: 1 rgba(0, 0, 0, 0);
			opacity: 1;
			position: relative;
			bottom: 190rpx;
			left: 60rpx;
		}


		._img {
			margin-left: 30rpx;
			margin-top: 12rpx;
			position: relative;
			left: 20rpx;
			bottom: 24rpx;

			.u-icon {
				position: relative;
				left: 106rpx;
				bottom: 30rpx;
			}
		}

		._data {
			position: relative;
			left: 35%;
			line-height: 45rpx;
			opacity: 1;
			bottom: 220rpx;
			font-size: 35rpx;
		}

		.QR-code {
			width: 416rpx;
			height: 416rpx;
			margin: auto;
			background-color: #FFFFFF;
			box-shadow: 1px 1px 1px 1px #888888;
			border: 2px darkslategray;
			position: absolute;
			bottom: 46.5%;
			left: 23%;
			border-radius: 7px;
		}

		.erweimabtn {}

	}
</style>
